<template>
	<view class="sub-order-content">
		<view class="order-top">
			<view class="search-box">
				<image src="../../static/icon-search.png" class="search-icon"></image>
				<input type="text" placeholder="输入订单编号搜索" class="search-input"/>
			</view>
			<image src="../../static/common/sub-order-back.png" class="sub-back-icon" @tap="goHome"></image>
			<view class="sub-home-top-icon">搜索</view>
		</view>
		
		<view class="nav-bar">
			<view class="nav-bar-item "
			v-for="(item,index) in navBar2" :key="index"
			:class="{'item-selected':index==navBarIndex}"
			@tap="chageTabBar(index)"
			>{{item.type}} ({{item.num}}) </view>
		</view>
		<scroll-view scroll-y="true" class="srcroll-box" @scrolltolower="loadMore"
		 refresher-enabled="true" :refresher-triggered="triggered"
		 :refresher-threshold="100" 
		 @refresherrefresh="onRefresh" @refresherrestore="onRestore" 
		>
			<view class="order-list">
				<view class="goods-list" v-if="orderList.length>0">
					<!-- 待操作 -->
					<tobeOperated
					v-if="navBarIndex == 0" v-for="(item,index) in orderList" :key="index"
					@giveUp="giveUp"
					@makeFillorder="makeFillorder"
					@makeOrder="makeOrder"
					:order="item"
					></tobeOperated>
					
					
					<!-- 待审核 -->
					<examine
						v-if="navBarIndex == 1" v-for="(item,index) in orderList" :key="index"
						@appeal="appeal"
						:order="item"
					></examine>
					
					<!-- 已失效 -->
					<subGood 
					v-if="navBarIndex == 2" v-for="(item,index) in orderList" :key="index"
					@taskDetail="taskDetail"
					:order="item"
					></subGood>
					
					<!-- 待评价 -->
					<evaluate
						v-if="navBarIndex == 3" v-for="(item,index) in orderList" :key="index"
						@appeal="appeal"
						:order="item"
					></evaluate>
					
					<!-- 待返还 -->
					<tobeReturn
					v-if="navBarIndex == 4" v-for="(item,index) in orderList" :key="index"
					@seeGift="seeGift"
					@taskDetail="taskDetail"
					@appeal="appeal"
					:order="item"
					></tobeReturn>
					
					<!-- 已完成 -->
					<finished
					v-if="navBarIndex == 5" v-for="(item,index) in orderList" :key="index"
					@taskDetail="taskDetail"
					@seeGift="seeGift"
					:order="item"
					@appeal="appeal"
					></finished>
				</view>
				
				<view class="nodatalist" v-else>
					<image src="../../static/common/nodata-sub.png" class="nodata"></image>
				</view>
			</view>
		</scroll-view>
		
		<!-- 放弃订单 -->
		<uni-popup ref="showGiveUp" :type="type">
			<view class="setInviteID CL">
				<view class="invite-title">放弃原因</view>
				<view class="clist">
					<view class="cl-type" v-for="(item,index) in giveUpResion" :key="index"
					@tap="choseType(index)"
					>
						<image :src=" item.is_select ? '../../static/common/allways-buy-icon.png':'../../static/common/cl-type-n.png'" class="cl-img"></image>
						<view class="type-text">{{item.type}}</view>
					</view>
				</view>
				<view class="invite-btns">
					<view class="invite-cancle" @tap="cancel('GiveUp')">取消</view>
					<view class="invite-submit" @tap="giveUpSubmit">确定</view>
				</view>
			</view>
		</uni-popup>
		
		<!-- 查看礼品 -->
		<uni-popup ref="showGift" :type="type">
			<view class="setInviteID CL">
				<view class="invite-title">{{goodsName}}</view>
				<view class="clist gift-clist">
					<image :src="getImgUrl(goodsImage)" class="gift-img"></image>
				</view>
				<view class="invite-btns">
					<view class="invite-cancle gift_cancle" @tap="cancel('Gift')">
						<image src="../../static/common/confirm.png" class="confirm"></image>
					</view>
					
				</view>
			</view>
		</uni-popup>
		
		<!-- 物流 -->
		<uni-popup ref="showwL" :type="type">
			<view class="setInviteID CL">
				<view class="invite-title">查看物流</view>
				<view class="clist wl-block">
					<view class="wl-company">快递公司：{{expressName}}</view>
					<view class="wl-num">快递单号：{{yundanId}}<image src="../../static/common/chaxun.png" class="chaxun" @tap="findExpress"></image></view>
					<view class="remark">注：点击查询按钮将复制单号跳转快递查询网站，请手动粘贴单号进行查询</view>
				</view>
				<view class="invite-btns">
					<view class="invite-cancle gift_cancle" @tap="cancel('wL')">
						<image src="../../static/common/confirm.png" class="confirm"></image>
					</view>
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	const util = require('../../util/util.js');
	import subGood from '../sub-good/sub-invalid.vue'
	import tobeOperated from '../sub-good/sub-tobe-operated.vue'
	import tobeReturn from '../sub-good/sub-tobe-return.vue'
	import finished from '../sub-good/sub-finished.vue'
	import evaluate from '../sub-good/sub-evaluate.vue'
	import examine from '../sub-good/sub-examine.vue'
	import uniPopup  from'../uni-popup/uni-popup.vue'
	
	export default{
		name:"subOrder",
		data(){
			return{
				type: 'center',//弹窗位置
				orderList:[],//订单列表
				navBarIndex:0,
				pageIndex:1,
				apptoken:"",
				orderType:1,//列表类型
				taskId:"", //任务ID
				giveUpResion:"",//放弃订单原因
				orderCount:"",//订单总数量
				nodata:false,
				goodsName:"",
				goodsImage:"",
				expressName:"",
				yundanId:"",
				triggered: true,
				freshing:false,
				navBarNew:[{ type:"待操作" },{type:"待审核"},{type:"已失效"},{ type:"待评价" },{ type:"待返还" },{ type:"已返还" }], 
				navBar2:this.navBar
			}
		},
		props:{
			navBar:{
				type:Array
			}
		},
		
		components:{
			subGood,tobeOperated,tobeReturn,finished,uniPopup,evaluate,examine
		},
		created() {
			this.apptoken = uni.getStorageSync("apptoken");
			//初始化加载代操作订单列表
			const url = this.$API.URL + this.$API.order_dianfu_unfinishorder;
			const data = {apptoken:this.apptoken,pageIndex:this.pageIndex,status:1};
			this.requestList(url,data)
			
			this.giveUpResion = this.$CommonJS.giveUpResion;//放弃订单
			
			//1待操作 2待审核 3待评价 4待返还 5已返还 9 已失效
		},
		methods:{
			onRefresh() {
					if (this.freshing) return;
					this.freshing = true;
					this.getOrderList(this.navBarIndex,null,"onRefresh");
					this.getOrderCount();
			},
			onRestore() {
					this.triggered = 'restore'; // 需要重置
			},
			getOrderCount(){
				//订单总数量
				const _this = this;
				uni.request({
					url:this.$API.URL + this.$API.user_orderCount,
					data:{apptoken:this.apptoken},
					success(res) {
						console.log(res);
						if(res.data.success){
							
							//将数量存入navBar数组，渲染
							const d = res.data.data;
						
							_this.navBarNew[0].num = d.dczOrderCount;//待操作
							_this.navBarNew[1].num = d.jxOrderCount;//待审核
							_this.navBarNew[2].num = d.CancelOrderCount;//已失效
							_this.navBarNew[3].num = d.dpjOrderCount;//待评价
							_this.navBarNew[4].num = d.dqrOrderCount;//待返还
							_this.navBarNew[5].num = d.lsOrderCount;//已完成
							
							_this.navBar2 = _this.navBarNew;
						}
					}
				})
			},						
			getImgUrl(url){
				//处理头像
				if(url && url.indexOf('http')==-1){
					return this.$CommonJS.getBaseImgUrl(url);
				}else{
					return url
				}
			},
			chageTabBar(index){
				//navbar
				console.log("index==="+index);
				this.navBarIndex = index;
				this.getOrderList(index);
			},
			getOrderList(index,type,refsh){
				console.log(444)
				//请求订单列表
				let url="",data={};
				switch(index){
					// case 0://全部订单
					// 	const url = "";
					// 	cosnt data ={apptoken:this.apptoken,pageIndex:this.pageIndex};
					// 	break;
					case 0://待操作
						if(!type){
							this.pageIndex = 1;
							this.nodata = false;
						}
						 url = this.$API.URL + this.$API.order_dianfu_unfinishorder;
						 data ={apptoken:this.apptoken,pageIndex:this.pageIndex,status:1};
						//this.orderType = 1;
						this.requestList(url,data,type,refsh);
						break;
					case 1://待审核
						if(!type){
							this.pageIndex = 1;
							this.nodata = false;
						}
						 url = this.$API.URL + this.$API.order_dianfu_unfinishorder;
						 data ={apptoken:this.apptoken,pageIndex:this.pageIndex,status:2};
						//this.orderType = 2;
						this.requestList(url,data,type,refsh);
						break;
					case 3://待评价
						if(!type){
							this.pageIndex = 1;
							this.nodata = false;
						}
						 url = this.$API.URL + this.$API.order_dianfu_unfinishorder;
						 data ={apptoken:this.apptoken,pageIndex:this.pageIndex,status:3};
						 console.log(data)
						//this.orderType = 3;
						this.requestList(url,data,type,refsh);
						break;
					case 4://待返还
						if(!type){
							this.pageIndex = 1;
							this.nodata = false;
						}
						 url = this.$API.URL + this.$API.order_dianfu_unfinishorder;
						 data ={apptoken:this.apptoken,pageIndex:this.pageIndex,status:4};
						//this.orderType = 4;
						console.log(this.orderType)
						
						this.requestList(url,data,type,refsh);
						break;
					case 2://已失效
							if(!type){
								this.pageIndex = 1;
								this.nodata = false;
							}
						 url = this.$API.URL + this.$API.order_dianfu_cancelorder;
						 data ={apptoken:this.apptoken,pageIndex:this.pageIndex};
						 
						 //this.orderType = 9;
						 this.requestList(url,data,type,refsh);
						break;
					case 5://已完成
							if(!type){
								this.pageIndex = 1;
								this.nodata = false;
							}
							
						 //this.orderType = 5;
						 url = this.$API.URL + this.$API.order_dianfu_finishorder;
						 data ={apptoken:this.apptoken,pageIndex:this.pageIndex};
						 this.requestList(url,data,type,refsh);
						break;		
				}
			},
			//分页加载-防抖
			loadMore: util.throttle(function(e) {
				console.log(111);
				if(!this.nodata){
					console.log(222)
					//console.log(this.orderType)
					switch(this.navBarIndex){
						case 0:
							this.getOrderList(0,"loadMore"); //待操作
							break;
						case 1:
							this.getOrderList(1,"loadMore"); //待审核
							break;
						case 2:
							this.getOrderList(2,"loadMore"); //已失效
							break;
						case 3:
							this.getOrderList(3,"loadMore"); //待评价
							break;
						case 4:
							this.getOrderList(4,"loadMore"); //待返还
							break;
						
						case 5:
							this.getOrderList(5,"loadMore"); //已完成
							break;
					}
				}
			}, 300),
			requestList(url,data,type,refsh){
				//发起数据请求
				console.log(JSON.stringify(data));
				console.log("加载第" + this.pageIndex +"页的数据");
				let _this = this;
				if(!this.nodata){
					uni.request({
						url:url,
						data:data,
						success(res) {
							console.log(res);
							if(res.data.success){
								if(res.data.data.length < 1 && _this.pageIndex!=1){
									_this.$CommonJS.showToast("没有更多数据了");
									_this.nodata = true;
									_this.triggered = false;
									_this.freshing = false;
									return;
								}else{
									// if(_this.orderType == 1){
									// 	//待操作倒计时
									// }
									if(type){
										//分页
										res.data.data.forEach(item=>{
											_this.orderList.push(item)
										})
										
									}else{
										//初始化或下拉刷新
										_this.orderList = res.data.data;
									}
									_this.pageIndex ++;
									if(refsh && refsh == "onRefresh"){
										_this.triggered = false;
										_this.freshing = false;
										uni.showToast({
											title:"刷新成功"
										})
									}
									
								}
								
							}else{
								_this.triggered = false;
								_this.freshing = false;
								_this.$CommonJS.showToast(res.data.msg);
							}
						}
					})
				}
				
			},
			giveUp(id){
				//放弃订单
				console.log("id=" + id);
				this.taskId = id;
				this.$refs['showGiveUp'].open();
			},
			choseType(index){
				//放弃订单
				this.giveUpResion.forEach(item=>{
					item.is_select = false;
				})
				this.giveUpResion[index].is_select = true;
			},
			giveUpSubmit(){
				//放弃订单提交
				let _this = this;
				var str = "";
				const buy_type = this.giveUpResion.filter(item=>{
					return item.is_select;
				})
				
				
				if(buy_type.length < 1 ){
					this.$CommonJS.showToast('请选择放弃原因');
				}else{
					const typeString = [];
					 buy_type.forEach(item=>{
						typeString.push(item.type);
					})
					str = typeString.join(',');
					//console.log(str)
					var id = this.taskId;
					uni.request({
						url:this.$API.URL + this.$API.task_cancel,
						data:{apptoken:this.apptoken,remark:str,customerTaskId:this.taskId},
						success(res) {
							console.log(res)
							if(res.data.success){
								uni.showToast({
									title:"操作成功",
									success() {
										_this.cancel('GiveUp');
										_this.orderList =	_this.orderList.filter(item=>{
											return item.id != id
										})
										_this.giveUpResion.forEach(item=>{
											item.is_select = false;
										})
										_this.getOrderCount();
									}
								})
								
							}else{
								_this.$CommonJS.showToast(res.data.msg)
							}
						}
					})
				}
			},
			makeFillorder(id){
				//回填订单号
				this.$CommonJS.navigateTo('../../pages/subBack/sub-fillorder/sub-fillorder?customertaskId='+id);
			},
			makeOrder(id){
				//下单
				this.$CommonJS.navigateTo('../../pages/subBack/sub-makeorder/sub-makeorder?taskId='+id);
			},
			seeGift(goodsName,goodsImage){
				//查看礼品
				this.goodsName = goodsName;
				this.goodsImage = goodsImage;
				this.$refs['showGift'].open();
			},
			appeal(id){
				//申诉
				uni.navigateTo({
					url:'../../pages/subBack/sub-appealing/sub-appealing?customerTaskId='+id,
				})
			},
			wL(yundanId,expressName){
				//打开物流窗口
				this.yundanId = yundanId;
				this.expressName = expressName;
				if(!yundanId || expressName){
					this.$CommonJS.showToast("暂无物流信息");
					return;
				}
				this.$refs['showwL'].open();
			},
			findExpress(){
				//物流查询
				const _this = this;
				uni.setClipboardData({
				    data: _this.yundanId,
				    success: function () {
				       _this.$CommonJS.showToast("单号复制成功");
							 setTimeout(function(){
								 //#ifdef APP-PLUS
								 	//plus.runtime.openURL('https://www.kuaidi100.com/?from=openv');
								 	plus.runtime.openURL(_this.$API.WLURL);
								 //#endif
							 },1500)
							 _this.cancel('wL');
				    }
				});
			
			},
			taskDetail(id,type){
				uni.navigateTo({
					url:'../../pages/subBack/sub-taskDetail/sub-taskDetail?taskId='+id +'&orderTye='+type
				})
				//this.$CommonJS.navigateTo('../../pages/subBack/sub-taskDetail/sub-taskDetail?taskId='+id);
			},
			goHome(){
				uni.switchTab({
					url:'../../pages/home/home'
				})
			},
			cancel(type) {
				this.$refs['show' + type].close();
				if(type == "GiveUp"){
					this.taskId = "";
					this.giveUpResion.forEach(item=>{
						 item.is_select = false;
					})
				}
			
				//this.$CommonJS.navigateTo('../orderBack/order-back')
			},
		}
	}
</script>

<style scoped>
	@import url("sub-order.css");
</style>
